<template>
  <div style="padding: 10px;">
    <el-row >
      <el-col>
        <div style="display: flex;">
          <div>
            <el-form :model="list_params" ref="searchForm"  size="small" :inline="true">
              <el-form-item label="" label-width="80px" prop="oddNumber">
                <el-input v-model="list_params.oddNumber" placeholder="单据编号" ></el-input>
              </el-form-item>
              <el-form-item label="" label-width="80px" prop="contractNumber">
                <el-input v-model="list_params.contractNumber" placeholder="合同号" ></el-input>
              </el-form-item>
              <el-form-item label="资方" prop="capitalId">
                <el-select filterable  v-model="list_params.capitalId" placeholder="请选择资方" clearable :style="{width: '100%'}">
                  <el-option v-for="item in capital_list" :label="item.name" :value="item.id"></el-option>
                </el-select>
              </el-form-item>
              <el-form-item>
                <el-button type="primary"  size="mini" @click="handleQuery">搜索</el-button>
                <el-button  size="mini" @click="resetQuery">重置</el-button>
              </el-form-item>
            </el-form>
          </div>
          <div style="flex: 1;"></div>
          <div>
            <!--                      <el-button>删除</el-button>-->
            <!--                      <el-button @click="handleEnable(0)" >禁用</el-button>-->
            <!--                      <el-button @click="handleEnable(1)" >启用</el-button>-->
<!--            <el-button @click="handleExport">导出</el-button>-->
            <!--                      <el-button>导入</el-button>-->
            <el-button type="primary" @click="addInfo" >新增</el-button>
          </div>
        </div>
      </el-col>
      <el-col>
        <div style="margin-top: 10px;">
          <el-table :data="list_data" @selection-change="handleSelectionChange"  :height="table_height" style="width: 100%;" >
            <el-table-column type="selection" width="50" align="center"  />
            <el-table-column label="单据编号" prop="oddNumber" width="120"></el-table-column>
            <el-table-column label="供货单" prop="containerNumber" width="120"></el-table-column>
            <el-table-column label="资方" prop="capitalName" width="120"></el-table-column>
            <el-table-column label="收款公司" prop="cargoOwnerName" width="120"></el-table-column>
            <el-table-column label="业务类型" prop="cargoOwnerName" width="120"></el-table-column>
            <el-table-column label="收款用途" prop="cargoOwnerName" width="120"></el-table-column>
            <el-table-column label="结算账户" prop="cargoOwnerName" width="120"></el-table-column>
            <el-table-column label="收款金额" prop="cargoOwnerName" width="120"></el-table-column>
            <el-table-column label="币种" prop="cargoOwnerName" width="120"></el-table-column>
            <el-table-column label="货主" prop="cargoOwnerName" width="120"></el-table-column>
            <el-table-column label="付款单位" prop="cargoOwnerName" width="120"></el-table-column>
            <el-table-column label="是否开票" prop="cargoOwnerName" width="120"></el-table-column>
            <el-table-column label="业务归属单位" prop="cargoOwnerName" width="180"></el-table-column>
            <el-table-column label="状态" prop="cargoOwnerName" width="120"></el-table-column>
            <el-table-column label="创建时间" prop="cargoOwnerName" width="120"></el-table-column>
            <el-table-column label="备注" prop="cargoOwnerName" width="120"></el-table-column>
            <el-table-column label="操作" prop="cargoOwnerName" fixed="right">
              <template slot-scope="scope" >
                <el-button
                  size="mini"
                  type="text"
                  @click="showInfo(scope.row)"
                >查看详情</el-button>
              </template>
            </el-table-column>
          </el-table>
        </div>
      </el-col>
    </el-row>
    <el-drawer title="新增还款单" size="80%" :visible.sync="dialog_show">
      <el-form  ref="form"  size="small" :inline="true" :rules="form_data_rules" :model="form_data">
        <div>
          <div class="section">
            <el-row>
              <el-col :span="7" >
                <el-form-item label="资方" prop="capitalId">
                  <el-select filterable  placeholder="请选择" v-model="form_data.capitalId" @change="onCapitalChange" :style="{width: '100%'}">
                    <el-option v-for="item in capital_list" :label="item.name" :value="item.id"></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="7" >
                <el-form-item label="计费方式" prop="billingMethod">
                  <el-select filterable  placeholder="请选择" v-model="form_data.billingMethod" @change="onBillingMethodChange" :style="{width: '100%'}">
                    <el-option label="A还款金额" value="1"></el-option>
                    <el-option label="B还款金额" value="2"></el-option>
                    <el-option label="C还款金额" value="3"></el-option>
                    <el-option label="D还款金额" value="4"></el-option>
                    <el-option label="E还款金额" value="5"></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
          </div>
          <div class="section">
            <div style="padding-bottom: 12px;">还款明细</div>
            <div >
              <el-table :data="[supply_order_info]" style="width: 100%" v-show="form_data.billingMethod == 1" >
                <el-table-column prop="date" label="序号">
                  <template slot-scope="scope" >
                    {{ scope.$index + 1 }}
                  </template>
                </el-table-column>
                <el-table-column prop="contractNumber" label="合同号">
                  <template slot-scope="scope" >
                    <el-select filterable  v-model="supply_order_info.supplyListId" @change="onSupplyOrderChange" >
                      <el-option label="请选择" value=""></el-option>
                      <el-option v-for="item in supply_order_list" :key="item.id" :label="item.contractNumber +' - '+item.containerNumber +' - '+item.cargoOwnerName" :value="item.id"></el-option>
                    </el-select>
                  </template>
                </el-table-column>
                <el-table-column prop="containerNumber" label="柜号">
                </el-table-column>
                <el-table-column prop="productNames" label="产品">
                </el-table-column>
                <el-table-column prop="paymentAmt" label="付汇金额">
                </el-table-column>
                <el-table-column prop="paymentDate" label="付汇日期">
                </el-table-column>
                <el-table-column prop="taxAmt" label="税金">
                </el-table-column>
                <el-table-column prop="taxDate" label="交税日期">
                </el-table-column>
                <el-table-column prop="prepaymentAmt" label="预付款">
                </el-table-column>
                <el-table-column prop="monthRate" label="月利率">
                  <template slot-scope="scope" >
                    <el-input v-model="supply_order_info.monthRate" @blur="getCalcA"></el-input>
                  </template>
                </el-table-column>
                <el-table-column prop="settlementDate" label="结算日期">
                  <template slot-scope="scope" >
                    <el-date-picker v-model="supply_order_info.settlementDate"  @blur="getCalcA" value-format="yyyy-MM-dd"></el-date-picker>
                  </template>
                </el-table-column>
                <el-table-column prop="adjustmentAmt" label="调整金额">
                  <template slot-scope="scope" >
                    <el-input v-model="supply_order_info.adjustmentAmt" @blur="getCalcA"></el-input>
                  </template>
                </el-table-column>
                <el-table-column prop="date" label="备注">
                  <template slot-scope="scope" >
                    <el-input v-model="supply_order_info.remark"></el-input>
                  </template>
                </el-table-column>
              </el-table>
              <el-table :data="[supply_order_info]" style="width: 100%" v-show="form_data.billingMethod == 2" >
                <el-table-column prop="date" label="序号">
                  <template slot-scope="scope" >
                    {{ scope.$index + 1 }}
                  </template>
                </el-table-column>
                <el-table-column prop="contractNumber" label="合同号">
                  <template slot-scope="scope" >
                    <el-select filterable   v-model="supply_order_info.supplyListId" @change="onSupplyOrderChange">
                      <el-option label="请选择" value=""></el-option>
                      <el-option v-for="item in supply_order_list" :key="item.id" :label="item.contractNumber +' - '+item.containerNumber +' - '+item.cargoOwnerName" :value="item.id"></el-option>
                    </el-select>
                  </template>
                </el-table-column>
                <el-table-column prop="containerNumber" label="柜号">
                </el-table-column>
                <el-table-column prop="productNames" label="产品">
                </el-table-column>
                <el-table-column prop="advanceAmt" label="垫款金额">
                </el-table-column>
                <el-table-column prop="advanceDate" label="垫款日期">
                </el-table-column>
                <el-table-column prop="monthRate" label="月利率">
                  <template slot-scope="scope" >
                    <el-input v-model="supply_order_info.monthRate" @blur="getCalcB"></el-input>
                  </template>
                </el-table-column>
                <el-table-column prop="prepaymentAmt" label="预付款">
                </el-table-column>
                <el-table-column prop="settlementDate" label="结算日期">
                  <template slot-scope="scope" >
                    <el-date-picker v-model="supply_order_info.settlementDate" @blur="getCalcB" value-format="yyyy-MM-dd"></el-date-picker>
                  </template>
                </el-table-column>
                <el-table-column prop="adjustmentAmt" label="调整金额">
                  <template slot-scope="scope" >
                    <el-input v-model="supply_order_info.adjustmentAmt" @blur="getCalcB"></el-input>
                  </template>
                </el-table-column>
                <el-table-column prop="date" label="备注">
                  <template slot-scope="scope" >
                    <el-input v-model="supply_order_info.remark"></el-input>
                  </template>
                </el-table-column>
              </el-table>
              <el-table :data="[supply_order_info]" style="width: 100%" v-show="form_data.billingMethod == 3" >
                <el-table-column prop="date" label="序号">
                  <template slot-scope="scope" >
                    {{ scope.$index + 1 }}
                  </template>
                </el-table-column>
                <el-table-column prop="contractNumber" label="合同号">
                  <template slot-scope="scope" >
                    <el-select filterable   v-model="supply_order_info.supplyListId" @change="onSupplyOrderChange">
                      <el-option label="请选择" value=""></el-option>
                      <el-option v-for="item in supply_order_list" :key="item.id" :label="item.contractNumber +' - '+item.containerNumber +' - '+item.cargoOwnerName" :value="item.id"></el-option>
                    </el-select>
                  </template>
                </el-table-column>
                <el-table-column prop="containerNumber" label="柜号">
                </el-table-column>
                <el-table-column prop="productNames" label="产品">
                </el-table-column>
                <el-table-column prop="totalWeight" label="总重量(KG)">
                </el-table-column>
                <el-table-column prop="outQuantity" label="本次出货量">
                  <template slot-scope="scope" >
                    <el-input v-model="supply_order_info.outQuantity" @blur="getCalcC"></el-input>
                  </template>
                </el-table-column>
                <el-table-column prop="advanceAmt" label="垫款金额">
                </el-table-column>
                <el-table-column prop="advanceDate" label="垫款日期">
                </el-table-column>
                <el-table-column prop="yearRate" label="年利率">
                  <template slot-scope="scope" >
                    <el-input v-model="supply_order_info.yearRate" @blur="getCalcC"></el-input>
                  </template>
                </el-table-column>
                <el-table-column prop="prepaymentAmt" label="预付款">
                </el-table-column>
                <el-table-column prop="settlementDate" label="结算日期">
                  <template slot-scope="scope" >
                    <el-date-picker v-model="supply_order_info.settlementDate" @blur="getCalcC" value-format="yyyy-MM-dd"></el-date-picker>
                  </template>
                </el-table-column>
                <el-table-column prop="adjustmentAmt" label="调整金额">
                  <template slot-scope="scope" >
                    <el-input v-model="supply_order_info.adjustmentAmt" @blur="getCalcC"></el-input>
                  </template>
                </el-table-column>
                <el-table-column prop="date" label="备注">
                  <template slot-scope="scope" >
                    <el-input v-model="supply_order_info.remark"></el-input>
                  </template>
                </el-table-column>
              </el-table>
              <el-table :data="[supply_order_info]" style="width: 100%" v-show="form_data.billingMethod == 4" >
                <el-table-column prop="date" label="序号">
                  <template slot-scope="scope" >
                    {{ scope.$index + 1 }}
                  </template>
                </el-table-column>
                <el-table-column prop="contractNumber" label="合同号" width="120">
                  <template slot-scope="scope" >
                    <el-select filterable  v-model="supply_order_info.supplyListId" @change="onSupplyOrderChange">
                      <el-option label="请选择" value=""></el-option>
                      <el-option v-for="item in supply_order_list" :key="item.id" :label="item.contractNumber +' - '+item.containerNumber +' - '+item.cargoOwnerName" :value="item.id"></el-option>
                    </el-select>
                  </template>
                </el-table-column>
                <el-table-column prop="containerNumber" label="柜号" width="120">
                </el-table-column>
                <el-table-column prop="productNames" label="产品" width="120">
                </el-table-column>
                <el-table-column prop="advancePaymentAmt" label="预付款付汇金额" width="120">
                  <template slot-scope="scope" >
                    <el-input v-model="supply_order_info.advancePaymentAmt" @blur="getCalcD"></el-input>
                  </template>
                </el-table-column>
                <el-table-column prop="tailAdvancePaymentAmt" label="尾款付汇金额" width="120">
                  <template slot-scope="scope" >
                    <el-input v-model="supply_order_info.tailAdvancePaymentAmt" @blur="getCalcD"></el-input>
                  </template>
                </el-table-column>
                <el-table-column prop="customsAmt" label="清关费" width="120">
                </el-table-column>
                <el-table-column prop="capitalHandlingFee" label="付汇手续费" width="120">
                  <template slot-scope="scope" >
                    <el-input v-model="supply_order_info.capitalHandlingFee" @blur="getCalcD"></el-input>
                  </template>
                </el-table-column>
                <el-table-column prop="taxAmt" label="税金" width="120">
                </el-table-column>
                <el-table-column prop="taxDate" label="交税日期" width="120">
                </el-table-column>
                <el-table-column prop="dayRate" label="日利率" width="120">
                  <template slot-scope="scope" >
                    <el-input v-model="supply_order_info.dayRate" @blur="getCalcD"></el-input>
                  </template>
                </el-table-column>
                <el-table-column prop="prepaymentAmt" label="预付款" width="120">
                </el-table-column>
                <el-table-column prop="settlementDate" label="结算日期" width="120">
                  <template slot-scope="scope" >
                    <el-date-picker v-model="supply_order_info.settlementDate" @blur="getCalcD" value-format="yyyy-MM-dd"></el-date-picker>
                  </template>
                </el-table-column>
                <el-table-column prop="adjustmentAmt" label="调整金额" width="120">
                  <template slot-scope="scope" >
                    <el-input v-model="supply_order_info.adjustmentAmt" @blur="getCalcD"></el-input>
                  </template>
                </el-table-column>
                <el-table-column prop="date" label="备注" width="120">
                  <template slot-scope="scope" >
                    <el-input v-model="supply_order_info.remark"></el-input>
                  </template>
                </el-table-column>
              </el-table>

              <el-table :data="[supply_order_info]" style="width: 100%" v-show="form_data.billingMethod == 5" >
                <el-table-column prop="date" label="序号">
                  <template slot-scope="scope" >
                    {{ scope.$index + 1 }}
                  </template>
                </el-table-column>
                <el-table-column prop="contractNumber" label="合同号">
                  <template slot-scope="scope" >
                    <el-select filterable  v-model="supply_order_info.supplyListId" @change="onSupplyOrderChange">
                      <el-option label="请选择" value=""></el-option>
                      <el-option v-for="item in supply_order_list" :key="item.id" :label="item.contractNumber +' - '+item.containerNumber +' - '+item.cargoOwnerName" :value="item.id"></el-option>
                    </el-select>
                  </template>
                </el-table-column>
                <el-table-column prop="containerNumber" label="柜号">
                </el-table-column>
                <el-table-column prop="productNames" label="产品">
                </el-table-column>
                <el-table-column prop="totalWeight" label="总重量(KG)">
                </el-table-column>
                <el-table-column prop="outQuantity" label="本次出货量">
                  <template slot-scope="scope" >
                    <el-input v-model="supply_order_info.outQuantity" @blur="getCalcE"></el-input>
                  </template>
                </el-table-column>
                <el-table-column prop="paymentAmt" label="付汇金额">
                </el-table-column>
                <el-table-column prop="prepaymentAmt" label="预付款">
                </el-table-column>
                <el-table-column prop="capitalHandlingFee" label="付汇手续费(资方)">
                  <template slot-scope="scope" >
                    <el-input v-model="supply_order_info.capitalHandlingFee" @blur="getCalcE"></el-input>
                  </template>
                </el-table-column>
                <el-table-column prop="paymentDate" label="付汇日期">
                </el-table-column>
                <el-table-column prop="taxAmt" label="税金">
                </el-table-column>
                <el-table-column prop="customsAmt" label="清关费">
                </el-table-column>
                <el-table-column prop="dayRate" label="日利率">
                  <template slot-scope="scope" >
                    <el-input v-model="supply_order_info.dayRate" @blur="getCalcE"></el-input>
                  </template>
                </el-table-column>
                <el-table-column prop="settlementDate" label="结算日期">
                  <template slot-scope="scope" >
                    <el-date-picker v-model="supply_order_info.settlementDate" @blur="getCalcE" value-format="yyyy-MM-dd"></el-date-picker>
                  </template>
                </el-table-column>
                <el-table-column prop="adjustmentAmt" label="调整金额">
                  <template slot-scope="scope" >
                    <el-input v-model="supply_order_info.adjustmentAmt" @blur="getCalcE"></el-input>
                  </template>
                </el-table-column>
                <el-table-column prop="date" label="备注">
                  <template slot-scope="scope" >
                    <el-input v-model="supply_order_info.remark"></el-input>
                  </template>
                </el-table-column>
              </el-table>
              <el-table :data="[]" style="width: 100%" v-show="form_data.billingMethod == ''" >
                <el-table-column prop="date" label="序号">
                  <template slot-scope="scope" >
                    {{ scope.$index + 1 }}
                  </template>
                </el-table-column>
                <el-table-column prop="date" label="单据编号">
                </el-table-column>
                <el-table-column prop="date" label="单据类型">
                </el-table-column>
                <el-table-column prop="date" label="合同号">
                </el-table-column>
                <el-table-column prop="date" label="柜号">
                </el-table-column>
                <el-table-column prop="date" label="货主">
                </el-table-column>
                <el-table-column prop="date" label="业务日期">
                </el-table-column>
                <el-table-column prop="date" label="单据金额">
                </el-table-column>
                <el-table-column prop="date" label="已核销金额">
                </el-table-column>
                <el-table-column prop="date" label="未核销金额">
                </el-table-column>
                <el-table-column prop="date" label="本次核销金额">
                  <template slot-scope="scope" >
                    <el-input ></el-input>
                  </template>
                </el-table-column>
              </el-table>
            </div>
            <div>
              <el-form-item label="合计还款金额" >
                {{supply_order_info.repaymentAmt}}
              </el-form-item>
            </div>
          </div>
          <div class="section" style="display: flex;justify-content: flex-end;position: sticky;bottom: 0px;">
            <el-button type="primary" @click="submitData">提交</el-button>
          </div>
        </div>
      </el-form>
    </el-drawer>
    <el-drawer
      title="代卖销售详情"
      size="80%"
      :visible.sync="edit_dialog_show">
      <div>
        <div class="section">
          <el-row>
            <el-col :span="4" class="section-item">
              <div class="section-item-title">销售单号</div>
              <div>HT2024121300001</div>
            </el-col>
            <el-col :span="4" class="section-item">
              <div class="section-item-title">销售日期</div>
              <div>-</div>
            </el-col>
            <el-col :span="4" class="section-item">
              <div class="section-item-title">供货单</div>
              <div>SEGU9718739</div>
            </el-col>
          </el-row>
        </div>
        <div class="section">
          <div style="padding-bottom: 12px;">产品明细</div>
          <div>
            <el-table :data="['']" show-summary>
              <el-table-column label="序号">
                <template slot-scope="scope" >
                  {{ scope.$index + 1 }}
                </template>
              </el-table-column>
              <el-table-column label="产品" prop="cargoOwnerName" >
              </el-table-column>
              <el-table-column label="规格">
              </el-table-column>
              <el-table-column label="销售数量" prop="cargoOwnerName" >
              </el-table-column>
              <el-table-column label="箱规(KG/件)" prop="cargoOwnerName" >
              </el-table-column>
              <el-table-column label="重量(KG)" prop="cargoOwnerName" >
              </el-table-column>
              <el-table-column label="销售单价" prop="cargoOwnerName" >
              </el-table-column>
              <el-table-column label="销售金额" prop="cargoOwnerName" >
              </el-table-column>
            </el-table>
          </div>
        </div>
        <div class="section">
          <div style="padding-bottom: 12px;">结算账户</div>
          <div>
            <el-table :data="['']" show-summary>
              <el-table-column label="序号">
                <template slot-scope="scope" >
                  {{ scope.$index + 1 }}
                </template>
              </el-table-column>
              <el-table-column label="科目"></el-table-column>
              <el-table-column label="金额"></el-table-column>
              <el-table-column label="备注"></el-table-column>
            </el-table>
          </div>
        </div>
        <div class="section">
          <div style="padding-bottom: 12px;">其他费用</div>
          <div>
            <el-table :data="['']" show-summary>
              <el-table-column label="序号">
                <template slot-scope="scope" >
                  {{ scope.$index + 1 }}
                </template>
              </el-table-column>
              <el-table-column label="科目"></el-table-column>
              <el-table-column label="金额"></el-table-column>
              <el-table-column label="备注"></el-table-column>
            </el-table>
          </div>
        </div>
      </div>
    </el-drawer>
  </div>
</template>

<script>
import {detail as supplyOrderDetail,list as supplyOrderList} from "@/api/supply/order";
import {list as feeList} from "@/api/fee/fee";
import {list,calcA,calcB,calcC,calcD,calcE,add,del} from "@/api/finance/repayment"
import { list as capitalList } from '@/api/base/capital'

export default {
  name: 'receive',
  data(){
    return {
      table_height:window.innerHeight - 300,
      dialog_show:false,
      edit_dialog_show:false,
      fees:[{ remark:'' }],
      list_params: {
        pageNum: 1,
        pageSize: 10,
        oddNumber: '',
        contractNumber:'',
        capitalId:''
      },
      form_data_rules:{
        capitalId:[
          {required:true, message: '请选择资方', trigger: 'change' }
        ],
        billingMethod:[
          {required:true, message: '请选择计算方式', trigger: 'change' }
        ]
      },
      form_data:{billingMethod:''},
      list_data:[],
      capital_list:[],
      supply_order_info:{},
      supply_order_list:[],
      submit_params:{}
    }
  },
  created() {
    this.getList()
    this.getCapitalList()
  },
  methods:{
    getSupplyOrderList(data){
      this.supply_order_list = []
      this.supply_order_info ={}
      //data
      supplyOrderList(data).then(res => {
        this.supply_order_list = res.rows;
      })
    },
    getCapitalList(){
      capitalList({is_page:0}).then(res => {
        this.capital_list = res.rows;
      })
    },
    getList(){
      list(this.list_params).then(res => {
        this.list_data = res.rows;
      })
    },
    handleQuery(){
      this.getList()
    },
    resetQuery(){
      this.list_params = {
        pageNum: 1,
        pageSize: 10,
        oddNumber: '',
        contractNumber:'',
        capitalId:''
      }
      this.getList()
    },
    handleSelectionChange(val) {
      this.multipleSelection = val;
    },
    delFee(row){
      this.fees.splice(row,1)
    },
    addFee(row){
      this.fees.push({ remark:'' })
    },
    submitData(){

      this.$refs['form'].validate((valid) => {
        if (valid) {
          if (this.submit_params.contractNumber == undefined){
            this.$message.error('请选择还款明细，并完成计算')
            return;
          }else{
            add({
              capitalId: this.form_data.capitalId,
              billingMethod: this.form_data.billingMethod,
              supplyListId: this.supply_order_info.id,
              interest: this.supply_order_info.interest,
              repaymentParam: this.submit_params,
              repaymentAmt: this.supply_order_info.repaymentAmt,
            }).then(res => {
              this.$message.success('添加成功')
            })
          }
        }
      })
    },
    showInfo(info){
      this.info = {}
      this.supply_order_info = {}
      this.fees = []
      detail(info.id).then(res=>{
        this.info = res.data
        supplyOrderDetail(res.data.supplyListId).then(res1 => {
          this.supply_order_info = {
            ...res1.data
          }
        })
        feeList({supplyListId:res.data.supplyListId,bizType:1,is_page:0}).then(res2 => {
          this.fees = res2.rows;
        })
      })
      this.edit_dialog_show = true
    },
    delitem(row) {
      let id = row.id;
      del(id).then(res=>{
        this.$message({
          message: '删除成功',
          type: 'success'
        })
        this.getList()
      })
    },
    addInfo(){
      this.dialog_show = true
    },
    onSupplyOrderChange(e){
      if (e == ''){
        return;
      }
      this.submit_params = {}
      let info = this.supply_order_list.find(item => item.id == e)
      supplyOrderDetail(e).then((res)=>{
        this.supply_order_info = {
          ...this.supply_order_info,  
          // contractNumber:res.data.contractNumber,
          ...res.data
        }

        if (this.form_data.billingMethod == 1){
          this.getCalcA()
        }else if (this.form_data.billingMethod == 2){
          this.getCalcB()
        }else if (this.form_data.billingMethod == 3){
          this.getCalcC()
        }else if (this.form_data.billingMethod == 4){
          this.getCalcD()
        }else if (this.form_data.billingMethod == 5){
          this.getCalcE()
        }
      })
    },
    getCalcA(){
      let calculate = false;
      let params;
      if (this.supply_order_info.monthRate != undefined&&this.supply_order_info.monthRate != ''&&this.supply_order_info.settlementDate != undefined &&this.supply_order_info.settlementDate != ''){
        calculate = true;
        if(this.supply_order_info.paymentAmt == null){
            this.$message.error('供货单缺失付汇金额')
            return;
        }
        if(this.supply_order_info.paymentDate == null){
          this.$message.error('供货单缺失付汇日期')
          return;
        }
        if(this.supply_order_info.taxAmt == null){
          this.$message.error('供货单缺失税金')
          return;
        }
        if(this.supply_order_info.taxDate == null){
          this.$message.error('供货单缺失交税时间')
          return;
        }
        
        params = {
          contractNumber:this.supply_order_info.contractNumber,
          containerNumber: this.supply_order_info.containerNumber,
          productIds: this.supply_order_info.productIds,
          productNames: this.supply_order_info.productNames,
          adjustmentAmt: this.supply_order_info.adjustmentAmt?this.supply_order_info.adjustmentAmt:0,
          remark: this.supply_order_info.remark?this.supply_order_info.remark:'' ,
          paymentAmt: this.supply_order_info.paymentAmt,
          paymentDate: this.supply_order_info.paymentDate,
          taxAmt: this.supply_order_info.taxAmt,
          taxDate: this.supply_order_info.taxDate,
          prepaymentAmt: this.supply_order_info.prepaymentAmt,
          monthRate: this.supply_order_info.monthRate,
          settlementDate: this.supply_order_info.settlementDate,
          calculate: calculate
        }
        this.submit_params = params;
      }else{
        params = {
          ...this.supply_order_info,
          calculate:calculate
        }
      }
      calcA(params).then((res)=>{
        this.supply_order_info = {
          ...this.supply_order_info,
          ...res.data
        }
      })
    },
    getCalcB(){
      let calculate = false;
      let params;
      if (this.supply_order_info.monthRate != undefined&&this.supply_order_info.monthRate != ''&&this.supply_order_info.settlementDate != undefined &&this.supply_order_info.settlementDate != ''){
        calculate = true;
        if(this.supply_order_info.advanceAmt == null){
            this.$message.error('供货单缺失垫款金额')
            return;
        }
        if(this.supply_order_info.advanceDate == null){
          this.$message.error('供货单缺失垫款日期')
          return;
        }
        if(this.supply_order_info.prepaymentAmt == null){
          this.$message.error('供货单缺失预付款')
          return;
        }
        params = {
          contractNumber: this.supply_order_info.contractNumber,
          containerNumber: this.supply_order_info.containerNumber,
          productIds: this.supply_order_info.productIds,
          productNames: this.supply_order_info.productNames,
          adjustmentAmt: this.supply_order_info.adjustmentAmt?this.supply_order_info.adjustmentAmt:0,
          remark: this.supply_order_info.remark?this.supply_order_info.remark:'' ,
          advanceAmt: this.supply_order_info.advanceAmt,
          advanceDate: this.supply_order_info.advanceDate,
          monthRate: this.supply_order_info.monthRate, 
          prepaymentAmt: this.supply_order_info.prepaymentAmt,
          settlementDate: this.supply_order_info.settlementDate ,
          calculate: true
        }
        this.submit_params = params;
      }else{
        params = {
          ...this.supply_order_info,
          calculate:calculate
        }
      }
      calcB(params).then((res)=>{
        this.supply_order_info = {
          ...this.supply_order_info,
          ...res.data,
          calculate:calculate
        }
      })
    },
    getCalcC(){
      let calculate = false;
      let params;
      if (this.supply_order_info.outQuantity != undefined&&this.supply_order_info.outQuantity != ''&&this.supply_order_info.yearRate != undefined&&this.supply_order_info.yearRate != ''&&this.supply_order_info.settlementDate != undefined &&this.supply_order_info.settlementDate != ''){
        calculate = true;
        if(this.supply_order_info.advanceAmt == null){
          this.$message.error('供货单缺失垫款金额')
          return;
        }
        if(this.supply_order_info.advanceDate == null){
          this.$message.error('供货单缺失垫款日期')
          return;
        }
        if(this.supply_order_info.prepaymentAmt == null){
          this.$message.error('供货单缺失预付款')
          return;
        }
        if(this.supply_order_info.totalWeight == null){
          this.$message.error('供货单缺失总重量')
          return;
        }
        params = {
          supplyListId: this.supply_order_info.id,
          contractNumber: this.supply_order_info.contractNumber,
          containerNumber: this.supply_order_info.containerNumber,
          productIds: this.supply_order_info.productIds,
          productNames: this.supply_order_info.productNames,
          adjustmentAmt: this.supply_order_info.adjustmentAmt?this.supply_order_info.adjustmentAmt:0,
          remark: this.supply_order_info.remark?this.supply_order_info.remark:'' ,
          totalWeight: this.supply_order_info.totalWeight,
          advanceAmt: this.supply_order_info.advanceAmt,
          advanceDate: this.supply_order_info.advanceDate,
          outQuantity: this.supply_order_info.outQuantity,
          yearRate: this.supply_order_info.yearRate,
          prepaymentAmt: this.supply_order_info.prepaymentAmt,
          settlementDate: this.supply_order_info.settlementDate ,
          calculate: calculate
        }
        this.submit_params = params;
      }else{
        params = {
        ...this.supply_order_info,
        calculate:calculate
      }
      }
      calcC(params).then((res)=>{
        let totalWeight = 0;
        this.supply_order_info = {
          ...this.supply_order_info,
          ...res.data,
          calculate:true
        }
      })
    },
    getCalcD(){
      let calculate = false;
      let params;
      if (this.supply_order_info.advancePaymentAmt != undefined&&this.supply_order_info.advancePaymentAmt != ''&&this.supply_order_info.tailAdvancePaymentAmt != undefined&&this.supply_order_info.tailAdvancePaymentAmt != ''&&this.supply_order_info.capitalHandlingFee != undefined &&this.supply_order_info.capitalHandlingFee != ''&&this.supply_order_info.dayRate != undefined &&this.supply_order_info.dayRate != ''&&this.supply_order_info.settlementDate != undefined &&this.supply_order_info.settlementDate != ''){
        calculate = true;
        
        if(this.supply_order_info.paymentAmt == null){
          this.$message.error('供货单缺失付汇金额')
          return;
        }
        if(this.supply_order_info.paymentDate == null){
          this.$message.error('供货单缺失付汇日期')
          return;
        }
        if(this.supply_order_info.prepaymentAmt == null){
          this.$message.error('供货单缺失预付款')
          return;
        }
        if(this.supply_order_info.customsAmt == null){
          this.$message.error('供货单缺失清关费')
          return;
        }
        if(this.supply_order_info.taxAmt == null){
          this.$message.error('供货单缺失税金')
          return;
        }
        if(this.supply_order_info.taxDate == null){
          this.$message.error('供货单缺失交税时间')
          return;
        }
        params = {
          contractNumber: this.supply_order_info.contractNumber,
          containerNumber: this.supply_order_info.containerNumber,
          productIds: this.supply_order_info.productIds,
          productNames: this.supply_order_info.productNames,
          adjustmentAmt: this.supply_order_info.adjustmentAmt?this.supply_order_info.adjustmentAmt:0,
          remark: this.supply_order_info.remark?this.supply_order_info.remark:'' ,
          advanceDate: this.supply_order_info.advanceDate,
          advancePaymentAmt: this.supply_order_info.advancePaymentAmt,
          tailAdvancePaymentAmt: this.supply_order_info.tailAdvancePaymentAmt,
          paymentAmt: this.supply_order_info.paymentAmt,
          paymentDate: this.supply_order_info.paymentDate,
          prepaymentAmt: this.supply_order_info.prepaymentAmt,
          customsAmt: this.supply_order_info.customsAmt,
          capitalHandlingFee: this.supply_order_info.capitalHandlingFee,
          taxAmt: this.supply_order_info.taxAmt,
          taxDate: this.supply_order_info.taxDate,
          dayRate: this.supply_order_info.dayRate,
          settlementDate: this.supply_order_info.settlementDate ,
          calculate: calculate
        }
        this.submit_params = params;
      }else{
        params = {
          ...this.supply_order_info,
          calculate:calculate
        }
      }
      calcD(params).then((res)=>{
        this.supply_order_info = {
          ...this.supply_order_info,
          ...res.data,
        }
      })
    },
    getCalcE(){
      let calculate = false;
      let params;
      if (this.supply_order_info.dayRate != undefined&&this.supply_order_info.dayRate != ''&&this.supply_order_info.outQuantity != undefined&&this.supply_order_info.outQuantity != ''&&this.supply_order_info.capitalHandlingFee != undefined&&this.supply_order_info.capitalHandlingFee != ''&&this.supply_order_info.settlementDate != ''&&this.supply_order_info.settlementDate != ''){
        calculate = true;
        
        if(this.supply_order_info.paymentAmt == null){
          this.$message.error('供货单缺失付汇金额')
          return;
        }
        if(this.supply_order_info.paymentDate == null){
          this.$message.error('供货单缺失付汇日期')
          return;
        }
        if(this.supply_order_info.prepaymentAmt == null){
          this.$message.error('供货单缺失预付款')
          return;
        }
        if(this.supply_order_info.totalWeight == null){
          this.$message.error('供货单缺失总重量')
          return;
        }
        if(this.supply_order_info.customsAmt == null){
          this.$message.error('供货单缺失清关费')
          return;
        }
        if(this.supply_order_info.taxAmt == null){
          this.$message.error('供货单缺失税金')
          return;
        }
        params = {
          contractNumber: this.supply_order_info.contractNumber,
          containerNumber: this.supply_order_info.containerNumber,
          productIds: this.supply_order_info.productIds,
          productNames: this.supply_order_info.productNames,
          adjustmentAmt: this.supply_order_info.adjustmentAmt?this.supply_order_info.adjustmentAmt:0,
          remark: this.supply_order_info.remark?this.supply_order_info.remark:'' ,
          totalWeight: this.supply_order_info.totalWeight,
          paymentAmt: this.supply_order_info.paymentAmt,
          prepaymentAmt: this.supply_order_info.prepaymentAmt,
          outQuantity: this.supply_order_info.outQuantity,
          capitalHandlingFee: this.supply_order_info.capitalHandlingFee,
          paymentDate: this.supply_order_info.paymentDate,
          taxAmt: this.supply_order_info.taxAmt,
          customsAmt: this.supply_order_info.customsAmt,
          dayRate: this.supply_order_info.dayRate,
          settlementDate: this.supply_order_info.settlementDate ,
          calculate: calculate
        }
        this.submit_params = params;
      }else{
        params = {
          ...this.supply_order_info,
          calculate:calculate
        }
      }
      calcE(params).then((res)=>{
        this.supply_order_info = {
          ...this.supply_order_info,
          ...res.data,
        }
      })
    },
    onCapitalChange(e){
      this.getSupplyOrderList({capitalId:e,is_page:0})
    },
    onBillingMethodChange(){
      this.supply_order_info = {}
      this.submit_params = {}
    },
    numberToChinese(num) {
      const charNum = ['零', '一', '二', '三', '四', '五', '六', '七', '八', '九'];
      const units = ['', '十', '百', '千', '万', '十', '百', '千', '亿'];
      num = Math.floor(num); // 转换为整数部分处理，避免小数点后的问题
      let chineseStr = '';
      let unitPos = 0; // units数组的位置
      while (num > 0) {
        let v = num % 10; // 取出当前位的数字
        if (v === 0) {
          chineseStr = charNum[v] + chineseStr; // 当前位为0时，只在前面加一个零，不增加单位（除非是最高位且为零）
        } else {
          chineseStr = charNum[v] + units[unitPos] + chineseStr; // 非零时加上单位和数字，并反转字符串顺序（已在最后处理）
        }
        num = Math.floor(num / 10); // 去掉当前位的数字，继续处理下一位数字
        unitPos++; // 单位位置前移一位
      }
      return chineseStr.replace(/零+/g, '零').replace(/零([亿万元])/g, '$1').replace(/(零+)/g, '零').replace(/零+$/, ''); // 处理连续的零和末尾的零，以及最后的单位处理（如"亿万"）和多余的零。
    }
  }
}
</script>


<style scoped>
.section{
  background: #fff;
  padding: 24px;
  margin: 20px;
  border-radius: 8px;
}
.section-item{
  margin: 10px 0px;
  height: 52px;
}
.section-item-title{
  padding-bottom: 10px;
  font-size: 14px;
}
</style>

<style>

.el-drawer__body{
  background: #F3F4F6;
}
.select-custom-icon .el-input__suffix {
  display: none; /* 隐藏默认的下拉箭头 */
}
.select-custom-icon .el-input__suffix::after {
  content: url('../../../assets/icons/more.png'); /* 替换为您的自定义图标路径 */
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
}
.popper-class{
  display: none;
}

</style>
